
<template>
  <div class="user" >
    <basic-container>
      <avue-crud :option="option"
                 ref="crud"
                 v-model="form"
                 :page.sync="page"
                 @on-load="onload"
                 :table-loading="listLoading"
                 @search-change="searchChange"
                 @refresh-change="refreshChange"
                 @size-change="sizeChange"
                 @current-change="currentChange"
                 :data="list">

      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
  import {fetchList} from "@/api/sys/user";
  import {tableOption} from '@/const/crud/admin/user';
  import {mapGetters} from "vuex";

  export default {
    name: "table_user",
    data() {
      return {
        searchForm:{},
        form: {},
        option: tableOption,
        treeDeptData: [],
        checkedKeys: [],
        roleProps: {
          label: "roleName",
          value: 'roleId'
        },
        defaultProps: {
          label: "name",
          value: 'id',
        },
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 5, // 每页显示多少条,
          pageSizes: [ 5, 10, 20, 30, 50],
          isAsc: false//是否倒序
        },
        list: [],
        listLoading: true,
        role: [],
        rolesOptions: []
      };
    },
    computed: {
      ...mapGetters(["permissions"])
    },
    watch: {
      role() {
        this.form.role = this.role
      }
    },
    created() {
      this.sys_user_add = this.permissions["sys_user_add"];
      this.sys_user_edit = this.permissions["sys_user_edit"];
      this.sys_user_del = this.permissions["sys_user_del"];
    },
    methods: {
      onload(page) {
        this.listLoading = true;
        fetchList(Object.assign({
          currentPage: page.currentPage,
          pageSize: page.pageSize
        }, this.searchForm)).then(response => {
          this.list = response.data.data.list;
          this.page.total = parseInt(response.data.data.total);
          this.listLoading = false;
        });
      },
      searchChange(form, done) {
        this.page.currentPage = 1
        this.searchForm = form;
        this.onload(this.page);
        done()
      },
      refreshChange() {
        this.onload(this.page)
      },
      sizeChange(pageSize) {
        this.page.currentPage = 1
        this.page.pageSize = pageSize
      },
      currentChange(current) {
        this.page.currentPage = current
      },

    }
  };
</script>
